<template>
  <el-tabs v-model="activeName" type="card">
    <el-tab-pane label="面试时间日历" name="first">
      <el-container style="margin-left: 1%; width: 98%">
        <interview-user-date style="margin-left: 1%; width: 98%">
        </interview-user-date>
      </el-container>
    </el-tab-pane>
    <el-tab-pane label="面试人员信息" name="second">
      <el-row>
        <el-col :span="8">
          <el-container>
            <el-header class="tabletitle">
              <el-col :span="24"><span>各部门招聘需求</span></el-col>
            </el-header>

            <interview-user-goal :tableData="tableData"> </interview-user-goal>
          </el-container>
        </el-col>

        <el-col :span="16">
          <el-container>
            <el-header class="intervierwtabletitle">
              <el-col :span="24"><span>面试人员信息表</span></el-col>
            </el-header>

            <interview-user-table :tableData="tableData">
            </interview-user-table>
          </el-container>
        </el-col>
      </el-row>
    </el-tab-pane>
    <el-tab-pane label="储备人才库" name="third">
      <reserve-user-index></reserve-user-index>
    </el-tab-pane>

    <!-- 抽屉 -->
    <interview-user-dialog
      :tableData="tableData"
    ></interview-user-dialog>

    <!-- 人员信息卡-->
    <interview-user-interview-card></interview-user-interview-card>
  </el-tabs>
</template>

<style>
.tabletitle {
  max-height: 30px;
  font-size: 25px;
  color: #58B7FF;
}

.intervierwtabletitle {
  max-height: 30px;
  font-size: 25px;
  color: #1D8CE0;
}
</style>

  <script>
import InterviewUserDialog from "./InterviewUserDialog.vue";
import InterviewUserInterviewCard from "./InterviewUserInterviewCard.vue";
import InterviewUserMenu from "./InterviewUserMenu.vue";
import InterviewUserTable from "./InterviewUserTable.vue";
import ReserveUserIndex from "../ReserveUser/ReserveUserIndex.vue";
import InterviewUserDate from "./InterviewUserDate.vue";
import InterviewUserGoal from "./InterviewUserGoal.vue";

export default {
  components: {
    InterviewUserTable,
    InterviewUserMenu,
    InterviewUserDialog,
    InterviewUserInterviewCard,
    ReserveUserIndex,
    InterviewUserDate,
    InterviewUserGoal,
  },

  data() {
    return {
      activeName: "first",
      // table所需数据
      tableData: [], // 总数据
    };
  },

  created() {
 
    this.getInterviewUser(2);
  },

  methods: {
   
    // 打开导出抽屉，同时给子组件的checkbox赋值
    openexport() {
      if (this.tableData && this.tableData.length > 0) {
        this.$refs.InterviewUserDrawer.tableTitle = this.tablename;
        this.$refs.InterviewUserDrawer.tableRange = this.tablename;
        this.$refs.InterviewUserDrawer.drawerexport = true;
      } else {
        this.$message.error("你看看有数据吗？你让我导出啥？");
      }
    },

    //获得人员信息
    async getInterviewUser(index) {
      let datas = { status: index };
      this.$axios
        .post("api/interview/getinterviewuser", datas)
        .then((response) => {
          this.tableData = response.data;
        })
        .catch(function (error) {
          console.log(error);
        });
    },
  },
};
</script>

  <style scoped>
.el-aside {
  height: 85vh;
}
</style>
